/* 客户申请
 * @Author: Setsuna
 * @Email: setsuna.xyz@qq.com
 * @FilePath: \src\pages\CustomerManage\CustomerApplication\List\index.tsx
 * @Date: 2023-07-27 15:50:25
 * @LastEditTime: 2023-07-27 15:50:25
 * @LastEditors: Setsuna
 */
import React from 'react'
import { BaseListPage, columnRenders, http, IBaseListPageState, IBaseListPageProps, UdDrawer } from '@/lib'

import { message, Select, Tag, Tooltip } from 'antd'
import udMainStore from '@/store/UdMain'
import UdSelect from '@/components/UdFormControls/UdSelect'
import apis from '@/apis/CustomerManage'
import DetailForm from '../component/DetailForm'
const { Option } = Select
export default class CustomerApplication extends BaseListPage<IProps, IState> {
  protected useConditionsField = true
  public brandList = udMainStore.brandList
  private STATUS_ENUM: any = {
    AUDITING: '审核中',
    AUDITFAIL: '已拒绝',
    AUDITSUCC: '已通过',
  }
  private PROCES_TYPE_ENUM: Record<string, any> = {
    AGENT_SOURCE: '问题货源',
    AGENT_REFUND: '退货出库',
    AGENT_ALLOT: '调拨出库',
  }
  constructor(props) {
    super(props)
    this.state = {
      title: '客户申请',
      queryApi: apis.getCustomerApplication,
      rowKey: 'id',
      conditions: [
        {
          label: '品牌公司',
          id: 'brandCode',
          initialValue: this.brandList[0].value,
          render: <UdSelect showSearch allowClear={false} options={this.brandList} />,
        },
        { label: '经销商编码', id: 'dealerCode' },
        { label: '经销商名称', id: 'dealerName' },
        {
          id: 'processType',
          label: '申请类型',
          initialValue: 'AGENT_SOURCE',
          render: () => (
            <Select placeholder="请选择状态" allowClear={false} >
              <Option value="AGENT_SOURCE">问题货源</Option>
              <Option value="AGENT_REFUND">退货出库</Option>
              <Option value="AGENT_ALLOT">调拨出库</Option>
            </Select>
          ),
        },
        {
          id: 'approvalStatus',
          label: '审批状态',
          render: () => (
            <Select placeholder="请选择状态">
              <Option value="AUDITSUCC">已通过</Option>
              <Option value="AUDITING">审核中</Option>
              <Option value="AUDITFAIL">已拒绝</Option>
            </Select>
          ),
        },
        { label: '同步内容', id: 'param' },
      ],
      columns: [
        { title: '序号', dataIndex: 'id', key: 'id', width: 50, render: (text, reoled, index) => index + 1 },
        { title: '品牌公司编码', dataIndex: 'brandCode', width: '100px' },
        { title: '品牌公司', dataIndex: 'brandName', width: '200px' },
        { title: '经销商编码', dataIndex: 'dealerCode', width: '100px' },
        { title: '经销商名称', dataIndex: 'dealerName', width: '200px' },
        {
          title: '申请类型',
          dataIndex: 'processType',
          key: 'processType',
          render: (text, record) => {
            return this.PROCES_TYPE_ENUM[record.processType] || ''
          },
          width: 90,
        },
        { title: '申请编号', dataIndex: 'tradeCode', width: '160px' },
        { title: '申请人员', dataIndex: 'createName', width: '100px' },
        { title: '申请时间', dataIndex: 'createTime', width: '180px' },
        {
          title: '审批状态',
          dataIndex: 'approvalStatus',
          key: 'approvalStatus',
          render: (text, record) => {
            return this.STATUS_ENUM[record.approvalStatus] || ''
          },
          width: 90,
        },
        { title: '审批时间', dataIndex: 'approvalTime', width: '180px' },
        {
          title: '同步状态',
          key: 'syncStatus',
          dataIndex: 'syncStatus',
          render: (text, record) => {
            let obj = {
              2: '同步失败',
              1: '同步成功',
              0: '未同步',
            }
            let color = {
              2: 'ee0a24',
              1: '#07c160',
              0: '#1989fa',
            }
            let state = obj[record.syncStatus]
            //* 23-10-7 审核中不显示同步状态
            return (record.syncStatus != null&& record.approvalStatus!=='AUDITING') ? <Tag color={color[text]}>{state}</Tag> : ''
          },
          width: '100px',
        },
        {
          title: '同步返回结果',
          dataIndex: 'syncMsg',
          width: '180px',
          render: (text, record) => {
            return (
              <Tooltip title={record.syncMsg}>
                <div style={{ width: '180px', overflow: 'hidden', whiteSpace: 'nowrap', textOverflow: 'ellipsis' }}>
                  {record.syncMsg}
                </div>
              </Tooltip>
            )
          },
        },
        {
          title: '同步内容',
          dataIndex: 'businessParam',
          width: '180px',
          render: (text, record) => {
            return (
              <Tooltip title={record.businessParam}>
                <div style={{ width: '180px', overflow: 'hidden', whiteSpace: 'nowrap', textOverflow: 'ellipsis' }}>
                  {record.businessParam}
                </div>
              </Tooltip>
            )
          },
        },
        {
          title: '操作',
          dataIndex: 'operate',
          fixedWidth: '100px',
          fixed: 'right',
          render: columnRenders.operate([
            { title: '查看详情', action: (text, record) => this.openDetail(record) },
            {
              title: '重发',
              show: (text: any, record: any) => record.approvalStatus === 'AUDITSUCC' && record.syncStatus !== 1,
              action: (text: any, record: any) => this.handRetry(record),
            },
          ]),
        },
      ],
      tableProps: {
        rowSelection: null,
        scroll: { x: true },
        rowKey: 'id',
      },
    }
  }

  private openDetail = (record): void => {
    UdDrawer.open({
      title: '查看详情',
      cancelText: null,
      width: '40%',
      content: <DetailForm record={record}/>,
      footer: null,
    })
  }

  private handRetry = (record: { tradeCode: string }) => {
    super.setState({ querying: true })
    http
      .post(apis.retransmission, { tradeCode: record.tradeCode })
      .then(res => {
        message.success('操作成功')
        this.query()
      })
      .finally(() => {
        super.setState({ querying: false })
      })
  }
}

interface IState extends IBaseListPageState {}

interface IProps extends IBaseListPageProps {}
